<template>
  <el-card header="基础信息">
    <el-form label-width="120px">
      <el-row :gutter="24">
        <el-col :span="12">
          <el-form-item label="标题">
            {{ fillData.Title }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="填报类型">
            <treeDicItem
              v-model="fillData.FillType"
              :dic-id="DictItemDic.fillInType"
              :readonly="true"
              placeholder="填报类型"
            />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="填报时间">
            {{ fillData.Time }}
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="填报说明">
            {{ fillData.Show }}
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </el-card>
</template>

<script>
import * as fillApi from '@/OA/api/fillIn'
import moment from 'moment'
import { DictItemDic } from '@/OA/config/oaConfig'
export default {
  components: {},
  props: {
    id: {
      type: String,
      default: null
    },
    formId: {
      type: String,
      default: null
    }
  },
  data() {
    return {
      DictItemDic,
      fillData: {}
    }
  },
  computed: {
    comId() {
      return this.$store.getters.curComId
    }
  },
  watch: {
    id: {
      handler(val) {
        if (val) {
          this.reset()
        }
      },
      immediate: true
    }
  },
  mounted() {},
  methods: {
    moment,
    async reset() {
      const res = await fillApi.Get(this.id)
      this.fillData = {
        Title: res.Title,
        Show: res.Show,
        FillType: res.FillType,
        Time:
          moment(res.BeginDate).format('YYYY-MM-DD') +
          ' 至 ' +
          moment(res.EndDate).format('YYYY-MM-DD')
      }
      this.$emit('update:formId', res.TableId)
    }
  }
}
</script>
